<!--A Design by W3layouts
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html>

<head>
    <title>个人信息</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords"
        content="Elite User Forms template Responsive, Login form web template,Flat Pricing tables,Flat Drop downs Sign up Web Templates, 
 Flat Web Templates, Login sign up Responsive web template, SmartPhone Compatible web template, free web designs for Nokia, Samsung, LG, SonyEricsson, Motorola web design">
    <script
        type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <!-- Custom Theme files -->
    <link href="css/font-awesome.css" rel="stylesheet">
    <link href="css/popup-box.css" rel="stylesheet" type="text/css" media="all" />
    <link href="css/style.css" rel='stylesheet' type='text/css' />
    <!--fonts-->
    <link href="//fonts.googleapis.com/css?family=Open+Sans:400,600,700,800" rel="stylesheet">
    <link href="//fonts.googleapis.com/css?family=Questrial" rel="stylesheet">
    <!--//fonts-->
    <style>
        .profile-ser-grids {
            width: 100%;
            float: none;

        }

        .profile-ser-grids h3 {
            font-size: 30px;
        }

        .profile-agileits {
            float: none;
            margin: 0 auto;
        }
    </style>
</head>

<body>
    <div class="agileinfo-dot">
        <div class="profile-agileits bg-color-agile">
            <div class="profile-pic wthree">
                <img id="avatar" src="images/prof.jpg" alt="Image">
            </div>
            <div class="follow-grids-agileits-w3layouts">
                <div class="profile-ser-grids">
                    <!-- <h3>Following</h3> -->
                    <!-- <h4>125</h4> -->
                </div>
                <div class="profile-ser-grids agileinfo" style="border:none">
                    <h3 id="nickname" class="nickname">一叶知秋</h3>
                    <!-- <h4>85</h4> -->
                </div>
                <div class="profile-ser-grids no-border">
                    <!-- <h3>Uploaded</h3> -->
                    <!-- <h4>210</h4> -->
                </div>
                <div class="clear"> </div>
            </div>
            <div class="profile-btm-w3-agileits">
                <div class="profile-grid">
                    <img src="images/p2.jpg" alt="Image">
                    <div class="profile-info-w3layouts">
                        <h4>Stephen</h4>
                        <p><i class="fa fa-map-marker" aria-hidden="true"></i>London</p>
                        <a href="#" class="one-w3ls">Follow</a><a href="#">messages</a>
                    </div>
                    <div class="clear"> </div>
                </div>

                <div class="profile-grid">
                    <img src="images/p1.jpg" alt="Image">
                    <div class="profile-info-w3layouts">
                        <h4>Jolina</h4>
                        <p><i class="fa fa-map-marker" aria-hidden="true"></i>California</p>
                        <a href="#" class="one-w3ls">Follow</a><a href="#">messages</a>
                    </div>
                    <div class="clear"> </div>
                </div>
            </div>
        </div>

        <div class="clear"></div>
    </div>
    <p class="footer">© 2019 爱的魔力转圈圈,转载请留下银行账号和密码 <a href="#"></a></p>
    <!--//login-->
    <div class="pop-up">
        <div id="small-dialog" class="mfp-hide book-form">
            <h3 class="sub-head-w3-agileits">Sign Up</h3>
            <form action="#" method="post">
                <input type="text" name="Name" placeholder="Username" required="" />
                <input type="email" name="Email" class="email" placeholder="Email" required="" />
                <input type="password" name="Password" class="password" placeholder="Password" required="" />
                <input type="password" name="Password" class="password" placeholder="Confirm Password" required="" />
                <input type="submit" value="Sign Up">
            </form>
        </div>
    </div>
    </div>
    <!--js-->
    <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
    <script src="./js/show.js"></script>
    <!--//js-->
    <!--popup-js-->
    <script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
    <script>
        $(document).ready(function () {
            $('.popup-with-zoom-anim').magnificPopup({
                type: 'inline',
                fixedContentPos: false,
                fixedBgPos: true,
                overflowY: 'auto',
                closeBtnInside: true,
                preloader: false,
                midClick: true,
                removalDelay: 300,
                mainClass: 'my-mfp-zoom-in'
            });

        });
    </script>
    <!--//popup-js-->

</body>

</html>